<template>
  <div>
    <!-- testing/Nav.vue -->
    <mt-navbar v-model="active">
      <mt-tab-item id="1">推荐
        <img slot="icon" src="/images/001.png">
      </mt-tab-item>
      <mt-tab-item id="2">科技
        <img slot="icon" src="/images/004.png">
      </mt-tab-item>
      <mt-tab-item id="3">数码
        <img slot="icon" src="/images/007.png">                    
      </mt-tab-item>
      <mt-tab-item id="4">军事
        <img slot="icon" src="/images/025.png">
      </mt-tab-item>
    </mt-navbar>
    <!-- 面板容器 -->
    <mt-tab-container v-model="active">
      <mt-tab-container-item id="1">面板1</mt-tab-container-item>
      <mt-tab-container-item id="2">面板2</mt-tab-container-item>
      <mt-tab-container-item id="3">面板3</mt-tab-container-item>
      <mt-tab-container-item id="4">面板4</mt-tab-container-item>
    </mt-tab-container>

  </div>
</template>
<script>
export default {
  data() {
    return {
      active: '1'
    }
  },
}
</script>
